<style>
    #modal_realTimeInquiry .modal-content {
        background: #ffffff;
    }
    
    #modal_realTimeInquiry .modal-content .modal-header .modal-title > div {
        border-right: 35px solid #ffffff;
    }
    
    #modal_realTimeInquiry .modal-body {
        padding: 0;
    }
    
    .realTimeInquiry-container {
        padding: 10px;
    }
    
    .realTimeInquiry-query > div {
        margin-right: 10px;
    }
    
    .realTimeInquiry-query > div:last-child {
        margin-right: 0px;
    }
    
    .realTimeInquiry-query {
        height: 25px;
        display: flex;
        line-height: 25px;
    }
    
    .datepicker-hour-select-wrap > span {
        width: 25px;
        float: left;
    }
    
    .datepicker-hour-select-wrap {
        left: -80px;
    }
    
    .realTimeInquiry-query .datepicker {
        height: 26px;
        line-height: 26px;
    }
    
    .realTimeInquiry-query .datepicker-date.style-5 {
        width: 120px;
    }
    
    .realTimeInquiry-query .datepicker-dateCtl {
        display: none;
    }
    
    .realTimeInquiry-query .datepicker-hour-select-wrap {
        z-index: 2;
        background-color: rgba(56, 137, 224, 0.95);
        width: 200px !important;
    }
    
    .realTimeInquiry-query .datepicker-hour > span:first-child {
        width: 35px;
        background: #ffffff;
    }
    
    .realTimeInquiry-query  .datepicker-hour > span {
        margin-left: 2px;
    }
    
    .search {
        border-radius: 3px;
        color: #ffffff;
        margin-right: 10px !important;
        text-align: center;
        width: 40px;
        background: #769aa8;
        cursor: pointer;
    }
    
    .search:hover {
        background: #3892e5;
    }
    
    .realTimeInquiry_content {
        background: #ffffff;
        padding-top: 15px;
        height: 200px;
        font-size: 16px;
        line-height: 32px;
    }
    
    .realTimeInquiry-query_time li.iPicker-ico{
        margin: 0px -1px 3px 2px !important;
    }
    
    .realTimeInquiry-query_time .DateAgentPicker .iPicker-minute input,
    .realTimeInquiry-query_time .DateAgentPicker .iPicker-hour input {
        margin: 0px 6px 3px 2px !important;
    }
    
    .realTimeInquiry-query_time .DateAgentPicker .Wdate{
        margin: 0px 6px 3px 0px !important;
    }
    </style>
    
    <div class="realTimeInquiry-container">
        <div class="realTimeInquiry-query ">
            <label style="margin-right: 5px">时间</label>
            <div class="realTimeInquiry-query_time" style="margin-right: 5px;">
                <input class="DateAgent" id="realTimeInquiry-startdatepicker" data-options="{'format':'d-h', 'mType': 'M5'}" value="">
            </div>
            <span style="margin-right: 5px">--</span>
            <div class="realTimeInquiry-query_time">
                <input class="DateAgent" id="realTimeInquiry-enddatepicker" data-options="{'format':'d-h', 'mType': 'M5'}" value="">
            </div>
    
            <div class="search" title="查询">查询</div>
        </div>
    
        <div class="realTimeInquiry_content" id="realTimeInquiry_contentMain"></div>
    </div>
    
    <script type="text/javascript">
    ;(function (call) {
        var main = {
            init: function () {
                this.initDatePicker();
                this.bindEvt();
                this.getTMaxWarnInfo();
            },
            // 初始化时间控件
            initDatePicker: function () {
                let time = new Date().format('yyyy-MM-dd 08:00');
                let firstTime = new Date(new Date().getTime() - 7 * 24 * 60 * 60 * 1000).format('yyyy-MM-dd 08:00');
                $('#realTimeInquiry-startdatepicker').val(firstTime);
                $('#realTimeInquiry-enddatepicker').val(time);
                $.IDate('.realTimeInquiry-query_time', {});
            },
            bindEvt: function () {
                $('.search').unbind('click').bind('click', () => {
                    this.getTMaxWarnInfo();
                });
            },
            // 获取产品图
            getTMaxWarnInfo: function () {
                let that = this;
                let startTime = new Date(`${$('#realTimeInquiry-startdatepicker').IDatePicker().getVal()}:00`);
                let endTime = new Date(`${$('#realTimeInquiry-enddatepicker').IDatePicker().getVal()}:00`);
                if (startTime >= endTime) {
                    alert('结束时间需大于开始时间');
                    return;
                }
                let params = {
                    areaCode: 'tj',
                    startTime: startTime.format('yyyyMMddhhmmss'),
                    endTime: endTime.format('yyyyMMddhhmmss')
                };
    
                loading.add();
                $.getJSON('shortWarn/autoStation/getTMaxWarnInfo', params, res => {
                    loading.remove();
                    $('#realTimeInquiry_contentMain').empty();
                    if (res.code === 200) {
                        $('#realTimeInquiry_contentMain').html(res.data);
                    }
                });
            },
        };
        if (typeof call === 'function') {
            call(main);
        }
    })(function (main) {
        CafeJS.models(['ajax'], function(){
            main.init();
        })
    });
    </script>
    